export const UnifiedDispatchingMarket = {
  title: {
    text: '统调负荷',
    x: 'center',
    y: 'top',
    textStyle: { // 主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
      fontSize: 16,
      color: '#fff'
    },
  },
  graphic: [{
    silent: true,
    type: 'text',
    left: 'center',
    top: '20%',
    invisible: true,
    xAxisIndex: 0,
    yAxisIndex: 0,
    style: {
      fill: '#9d9d9d',
      text: '暂无数据',
      fontWeight: 'bold',
      fontFamily: 'Microsoft YaHei',
      fontSize: '35px'
    }
  }, {
    silent: true,
    type: 'text',
    left: 'center',
    bottom: '30%',
    invisible: true,
    xAxisIndex: 1,
    yAxisIndex: 1,
    style: {
      fill: '#9d9d9d',
      text: '暂无数据',
      fontWeight: 'bold',
      fontFamily: 'Microsoft YaHei',
      fontSize: '35px'
    }
  },],
  legend: {
    data: [
      "统调负荷-预测",
      "统调负荷-日前",
      "统调负荷-实际"


    ],
    textStyle: {
      color: '#fff'
    },
    top: "8%",
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: "cross",
      backgroundColor: "rgba(255, 255, 255, 0.8)",
      position: function (pos, params, el, elRect, size) {
        var obj = { top: 10 };
        obj[["left", "right"][+(pos[0] < size.viewSize[0] / 2)]] = 30;
        return obj;
      },
      extraCssText: "width: 170px",
    },
    formatter: function (params) {
      // console.log(params);
      let temp = `<div>${params
        .map((item, index) => {
          if (params[0].seriesType == "line") {
            return `
            <div style="display: flex;justify-content: flex-start;align-items: center;margin-top: 6px">
              <div style="width: 8px;height:8px;border-radius:50%;background-color:${item.color
              };"></div>
              <div style="margin-left: 10px">
                ${item.seriesName}：${item.data || "--"}
              </div>
            </div>
            `;
          } else {
            if (index != 0) {
              return `
            <div style="display: flex;justify-content: flex-start;align-items: center;margin-top: 6px">
              <div style="width: 8px;height:8px;border-radius:50%;background-color:${item.color
                };"></div>
              <div style="margin-left: 10px">
                ${item.seriesName}：${item.data || "--"}
              </div>
            </div>
            `;
            }
          }
        })
        .join("")}</div>`;
      if (params[0].seriesType == "line") {
        return `
        <div>
          <div>${params[0].name}</div>
          ${temp}
        </div>
        `;
      } else {
        return `
        <div>
          <div>${params[0].name}</div>
          ${temp}
          <div style="display: flex;justify-content: flex-start;align-items: center;margin-top: 6px">
            <div style="width: 8px;height:8px;border-radius:50%;background-color:${params[0].color
          };"></div>
            <div style="margin-left: 10px">
              ${params[0].seriesName}：${params[0].data || "--"}
            </div>
          </div>
        </div>
        `;
      }

    },
  },
  axisPointer: {
    link: { xAxisIndex: "all" },
    label: {
      backgroundColor: "#777",
    },
  },
  color: ["#f69648", "#746deb", "#61ddaa"], // 三条曲线颜色
  grid: [
    {
      height: "28%",
      right: "2%",
      left: "6%",
      top: "15%",
    },
    {
      height: "30%",
      right: "2%",
      left: "6%",
      bottom: "14%",
    },
  ],
  xAxis: [
    {
      show: false, //隐藏了x轴
      type: "category",
      gridIndex: 0, //对应前面grid的索引位置（第一个）
      axisTick: {
        show: false,
      },
      axisLabel: {
        formatter: (value) =>  //X轴的内容
        {

          let ret = ""; //拼接加\n返回的类目项
          let max = 10;  //每行显示的文字字数
          let val = value.length;  //X轴内容的文字字数
          let rowN = Math.ceil(val / max);  //需要换的行数
          if (rowN > 1)  //判断 如果字数大于2就换行
          {
            for (let i = 0; i < rowN; i++) {
              let temp = "";  //每次截取的字符串
              let start = i * max;  //开始截取的位置
              let end = start + max;  //结束截取的位置
              temp = value.substring(start, end) + "\n";
              ret += temp;  //最终的字符串
            }
            return ret;
          }
          else { return value }
        }
      },
      axisPointer: {
        // show: false
      },

      data: [],
    },
    {
      show: true, //隐藏了x轴
      type: "category",
      gridIndex: 1, //对应前面grid的索引位置（第二个）
      axisTick: {
        show: false,
      },
      axisLabel: {
        formatter: (value) =>  //X轴的内容
        {

          let ret = ""; //拼接加\n返回的类目项
          let max = 10;  //每行显示的文字字数
          let val = value.length;  //X轴内容的文字字数
          let rowN = Math.ceil(val / max);  //需要换的行数
          if (rowN > 1)  //判断 如果字数大于2就换行
          {
            for (let i = 0; i < rowN; i++) {
              let temp = "";  //每次截取的字符串
              let start = i * max;  //开始截取的位置
              let end = start + max;  //结束截取的位置
              temp = value.substring(start, end) + "\n";
              ret += temp;  //最终的字符串
            }
            return ret;
          }
          else { return value }
        }
      },

      data: [],
    },
  ],

  //y轴，不管有几个x轴，几个y轴，或者图，只要找到他对应的grid图的序号索引就可以精准匹配
  yAxis: [
    {
      type: "value",
      gridIndex: 0,
      name: "出力（MW）",
      nameTextStyle: {
        padding: [0, 0, 10, 0],
        fontSize: 13, //y轴坐标轴上title字体大小
        fontWeight: "bold",
        color: "#fff",
      },
      position: "left",
      splitLine: {
        lineStyle: {
          color: ['#666'],
          type: 'solid'//虚线
        },
        show: true,
      },
      //nameLocation: 'start',//y轴name的位置
      //inverse: true,
      axisLine: {
        show: false,
      },
      axisLabel: {
        formatter: "{value}",
        fontSize: 12, //y轴坐标轴上的字体大小
      },
    },
    {
      type: "value",
      gridIndex: 1,
      // nameLocation: "middle",
      name: "偏差（MW）",
      nameTextStyle: {
        padding: [0, 0, 10, 0],
        fontSize: 13, //y轴坐标轴上title字体大小
        fontWeight: "bold",
        color: "#fff",
      },
      splitLine: {
        lineStyle: {
          color: ['#666'],
          type: 'solid'//虚线
        },
        show: true,
      },
      position: "left",
      axisLine: {
        show: false,
      },
      axisLabel: {
        formatter: "{value}",
      },
    }

  ],
  series: [
    {
      name: "统调负荷-预测",
      type: "line",
      smooth: true,
      symbol: "none",
      xAxisIndex: 0,
      yAxisIndex: 0,
      zlevel: 1,
      z: 1,
      data: [],
      itemStyle: {
        normal: {
          lineStyle: {
            width: 2,
            type: 'dotted'
          }
        }
      },
    },
    {
      name: "统调负荷-日前",
      type: "line",
      smooth: true,
      symbol: "none",
      xAxisIndex: 0,
      yAxisIndex: 0,
      zlevel: 1,
      z: 1,
      data: [],
    },
    {
      name: "统调负荷-实际",
      type: "line",
      smooth: true,
      symbol: "none",
      xAxisIndex: 0,
      yAxisIndex: 0,
      zlevel: 1,
      z: 1,
      data: [],
    },
    {
      name: "偏差量",
      type: "bar",
      xAxisIndex: 1,
      yAxisIndex: 1,
      data: [],
      itemStyle: {
        color: function (params) {
          let colorList = ["#C96771", "#7EB889"];
          let index = params.data > 0 ? 0 : 1;
          return colorList[index];
        },
      },

    },
    {
      type: "line",
      xAxisIndex: 0,
      yAxisIndex: 0,
      markLine: {
        symbol: ['none', 'none'],
        label: { show: false },
        lineStyle: {
          color: "#666"
        },
        emphasis: {
          disabled: true
        },
        data: []
      },
    },
    {
      type: "line",
      xAxisIndex: 1,
      yAxisIndex: 1,
      data: [],
      markLine: {
        symbol: ['none', 'none'],
        label: { show: false },
        lineStyle: {
          color: "#666"
        },
        emphasis: {
          disabled: true
        },
        data: []
      },
    },
  ],
  dataZoom: [
    {
      type: "slider",
      show: true,
      xAxisIndex: [0, 1],
      start: 0,
      end: 100,
      height: 8,
      bottom: "3%",
    },
  ],
};